<template>
    <div>
        <el-dialog title="复用巡检项" :visible.sync="visible" width="30%" center @closed="dialogReset">
            <el-form ref="form" :model="form" label-width="100px">
                <el-form-item label="巡检项内容">
                    <el-input v-model="form.name" disabled></el-input>
                </el-form-item>
                <el-form-item label="巡检点">
                    <el-select v-model="form.pointId" placeholder="请选择巡检点">
                        <el-option v-for="point in form.points" :label="point.name" :value="point.id" :key="point.id">
                        </el-option>
                    </el-select>
                </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button @click="visible = false">取 消</el-button>
                <el-button type="primary" @click="reuse">确定复用</el-button>
            </span>
        </el-dialog>
    </div>
</template>

<script>
    import axios from 'axios'

    export default {
        name: "reuse-item",
        data() {
            return {
                visible: false,
                form: {
                    itemId: '',
                    name: '',
                    points: [],
                    pointId: ''
                }
            }
        },
        methods: {
            dialogReset() {

            },
            init(itemId, name, pointId) {
                this.visible = true;
                this.form.pointId = pointId;
                this.form.name = name;
                this.form.itemId = itemId;
                this.$nextTick(() => {
                    axios.get('http://gulimall.com/api/inspection/point/listAllPoints').then(
                        response => {
                            this.form.points = response.data.data;
                            console.log(this.form.points);
                        },
                        error => {
                            console.warn('获取所有的巡检点信息出现错误');
                        }
                    );
                });
            },
            reuse() {
                axios.get('http://gulimall.com/api/inspection/item/reuse', {
                    params: {
                        itemId: this.form.itemId,
                        pointId: this.form.pointId
                    }
                }).then(
                    response => {this.showMessage('复用巡检项成功');},
                    error => {this.showMessage('复用巡检项失败');}
                )
            },
            showMessage(msg) {
                this.$message({
                    message: msg,
                    type: 'success',
                    duration: 1500,
                    onClose: () => {
                        this.visible = false;
                        this.$emit('refreshReuseList')
                    }
                });
            }
        }
    }
</script>

<style scoped>
</style>
